<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
	<title>员工绩效分配</title>
	<link href="../../../static/css/element-2.0.css" rel="stylesheet">
  <link href="../../../static/css/element-extends.css" rel="stylesheet">
  <style>
  	.el-table .cell{padding: 0 10px;}
  </style>
</head>

<body>

<el-row :gutter="20" id="app" v-cloak>
<el-col :span="24">
	<div class="block mt mb">
		<el-button type="primary" icon="el-icon-plus" size="mini" @click="adduser">退还业绩人员</el-button>
		<el-button type="primary" icon="el-icon-info" size="mini" @click="chakandingdan">订单信息</el-button>
	</div>

	<el-table :data="ulist" show-summary :summary-method="getSummaries" height="400">
		<el-table-column type="index" label="#"></el-table-column>
		<el-table-column prop="name" label="姓名"></el-table-column>
		<el-table-column prop="type" label="类型">
			<template slot-scope="scope">
				<el-tag size="mini" type="danger" v-if="scope.row.type%2">扣除提成</el-tag>
				<el-tag size="mini" type="warning" v-else>其他提成</el-tag>
			</template>
		</el-table-column>
		<el-table-column prop="feat" label="业绩"></el-table-column>
		<el-table-column prop="percent" label="提成比">
			<template slot-scope="scope">
				<el-input v-model="scope.row.percent" size="mini" @change="changeamount(scope.row)" placeholder="范围（0 ~ 100）" :disabled="scope.row.type===4"></el-input>
			</template>
		</el-table-column>
		<el-table-column prop="money" label="绩效">
			<template slot-scope="scope">
				<el-input v-model="scope.row.money" size="mini" @change="changticheng(scope.row)" placeholder="固定提成金额" v-if="scope.row.type%2"></el-input>
				<el-input v-model="scope.row.money" size="mini" placeholder="固定提成金额" v-else></el-input>
			</template>
		</el-table-column>
		<el-table-column label="移除">
			<template slot-scope="scope">
				<el-button type="danger" icon="el-icon-delete" size="mini" @click="deleterow(scope.$index)" :disabled="scope.row.nodelete"></el-button>
			</template>
		</el-table-column>
	</el-table>

	<div class="block right mt">
		<el-button type="warning" icon="el-icon-upload" @click="onSubmit">重新分配</el-button>
		<el-button type="danger" icon="el-icon-close" onclick="C.closewin()">取消关闭</el-button>
	</div>

</el-col>
</el-row>

</body>
<script>
const {C, Vue} = require('../../../src/common/app.js')
let Req = C.getDatas();
var vm = new Vue({
	el : '#app',
	data : {
		ulist: [],
		delus: [],
		oid: Req.id,
		otype: Req.ordertype,
		gid: Req.gid,
	},
	methods : {
		adduser: async function(){
			let data = await C.openBrowserWindow('/html/shop/popup/selectappuser.html', {gid: this.gid}, {width: 1200, height: 860})
			if (data) {
				data.forEach((row) => {
					// 判断是否重复
					if (C.inarray({userid: row.id}, this.ulist) === -1) {
						this.ulist.push({
							feat: 0,
							name: row.name,
							percent: 0,
							type: 4,
							money: '',
							userid: row.id,
							nodelete: false,
						})
					} else {
						C.error('扣除业绩人员重复');
					}
				})
			}
		},

		changeamount: function (row) {
			row.money = (row.feat * row.percent / 100).toFixed(2)
		},

		changticheng: function (row) {
			row.percent = (row.money / row.feat * 100).toFixed(2)
		},

		getSummaries: function (param) {
			const { columns, data } = param;
			const sums = [];
			columns.forEach((column, index) => {
			if (index === 0) {
			  sums[index] = '合计';
			  return;
			}
			if (index === 5) {
			  const values = data.map(item => Number(item[column.property]));
			  if (!values.every(value => isNaN(value))) {
			    sums[index] = values.reduce((prev, curr) => {
			      const value = Number(curr);
			      if (!isNaN(value)) {
			        return prev + curr;
			      } else {
			        return prev;
			      }
			    }, 0);
			    sums[index] = sums[index].toFixed(2)
			    sums[index] += ' 元';
			  } else {
			    sums[index] = 'N/A';
			  }
			}
			});
			return sums;
		},

		onSubmit: async function () {
			// 进行判断
			let e = false
			let that = this
			let data = {
						userinfo: JSON.stringify(that.ulist),
						delus: JSON.stringify(this.delus),
						orderid: this.oid,
						ordertype: this.otype
					}

			if (this.ulist <= 0) {
				C.confirm('该单据将不产生任何提成，确定继续吗？', async () => {
					let res = await C.ajax('/shop/kaidancheck/againallotpercent', data, 'post')
					if (res) C.closeBrowserWindow(res)
				})
			} else {
				this.ulist.forEach((row) => {
					if (row.money >= 0) e = true
				})
				if (e) {
					C.error('金额必须小于零！')
					return false
				}
				let res = C.ajax('/shop/kaidancheck/againallotpercent', data, 'post')
				if (res) C.closeBrowserWindow(res)
			}
		},

		chakandingdan: async function () {
			await C.openBrowserWindow('/html/shop/backcard/backcard_backinfo.html', {id: this.oid, gid: this.gid, ordertype: this.ordertype}, {width: 1400, height: 900});
		},

		deleterow: function (index) {
			if (this.ulist[index].id) {
				this.delus.push(this.ulist[index].id);
			}
			this.ulist.splice(index, 1)
		},

		getmsg: async function () {
			let list = await C.ajax('/shop/backcard/yejitichentlist', {orderid: Req.id}, 'post')
			if (list) {
				list.forEach((row) => {
					this.ulist.push({
						id: row.id,
						userid: row.userid,
						name: row.name,
						type: row.type,
						feat: row.yeji,
						percent: row.tichengbi,
						nodelete: (row.type%2?true:false),
						money: row.money
					})
				})
			}
		},

	},
	mounted : function(){
		this.getmsg()
	}
})
</script>
</html>